import { DiagramDocumentationInspectorNextJS } from '@5minds/processcube_app_sdk/client';
import '@5minds/processcube_app_sdk/client/components/DiagramDocumentationInspector.css';

import { getDiagramByPath, getDiagramsPaths } from '../utils/getDiagrams';

export async function generateStaticParams() {
  const diagramsPaths = await getDiagramsPaths();
  const filepaths = diagramsPaths.map((diagram) => {
    const publicPath = diagram.publicPath;

    return {
      filepath: publicPath.split('/'),
    };
  });

  return filepaths;
}

async function Page({ params }: { params: { filepath: string[] } }) {
  const diagram = await getDiagramByPath(params.filepath.join('/'));

  return <DiagramDocumentationInspectorNextJS xml={diagram} />;
}

export default Page;